<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>选择器练习2</title>
    <style>
      /*伪类选择器*/
      a:link {/*未访问*/
        color: red;
      }
      a:visited {/*访问过*/
        color: green;
      }
      a:hover {/*鼠标放在上边*/
        color: yellow;
      }
      a:active {/*鼠标点击*/
        color: blue;
      }
      /*子元素选择器*/
      div>div>p {
        color: red;
      }
    </style>
</head>
<body>
  <a href="#7">超链接1</a>
  <a href="#8">超链接2</a>
  <a href="#9">超链接3</a>

  <p>p1</p>
  <div><p>p2</p></div>
  <div>
    <div><p>p3</p></div>
    <div>
      <div><p>p4</p></div>
    </div>
  </div>
</body>
</html>